<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>注册</title>
    <link rel="stylesheet" href="./css/login.css" />
    <script src="./js/axios.min.js"></script>
    <style>
      * {
        margin: 0;
        padding: 0;
      }
      body {
        position: relative;
      }
      .bo {
        width: 100%;
        height: 750px;
        float: right;
        background-image: url(./png/gl1-1-1.png);
        background-repeat: no-repeat;
        background-size: 100%;
        position: relative;
        filter: drop-shadow(16px 16px 20px #909090);
      }

      .bo1 {
        width: 1200px;
        height: 750px;
        background-image: url(./png/lbjn.png);
        background-repeat: no-repeat;
        position: absolute;
        top: -100px;
        left: -150px;
        filter: drop-shadow(1px 6px 20px #000);
        z-index: 9;
        animation: dac 3s linear infinite;
      }
      @keyframes dac {
        0% {
          top: -100px;
          left: -150px;
        }
        50% {
          top: 40px;
          left: -350px;
        }
        100% {
          top: -100px;
          left: -150px;
        }
      }
    </style>
  </head>
  <body>
    <div class="bo"></div>
    <div class="bo1"></div>
    <!-- // -->
    <div class="box">
      <div class="box2"></div>
      <div class="box3">
        <h1>注册</h1>
        <p>账号：<input type="text" /><span id="sp1"></span></p>
        <p>密码：<input type="password" /></p>
        <p><input type="button" value="注册" /></p>
        <p><a href="login.html">已有账号？去登录</a></p>
      </div>
    </div>
    <script>
      //1-给注册按钮添加事件
      let sp1 = document.querySelectorAll("#sp1");
      let ipts = document.querySelectorAll("input");
      ipts[2].onclick = function () {
        let uname = ipts[0].value;
        let pd = ipts[1].value;

        // 请求
        let regAPI = "http://jx.xuzhixiang.top/ap/api/reg.php";
        axios
          .get(regAPI, { params: { username: uname, password: pd } })
          .then((r) => {
            console.log(r.data);
            alert(r.data.msg);
            if (r.data.code == 1) {
              location.href = "login.html";
            }
          });
      };
      //
    </script>
  </body>
</html>
